<template>
    <view class="wai">
        <view class="bgi">
            <image class="img-bgi" src="@/static/wallet_card.png" mode=""></image>
            <view class="yuan">总额(元)</view>
           <view class="mony">{{userProfile.income?userProfile.income:0}}</view>
        </view>
        <view class="btm">
            <view>提现金额</view>
            <view class="flex">
                <view class="qq">¥</view>
                <input class="input" type="number" placeholder="输入提现金额" @input="iptAmount"/>
            </view>
            <view class="btn" @click="jihuo">提交</view>
        </view>
    </view>
</template>

<script setup>
	import {
		getshopbk,
		withdrawApply,
		getBank
	} from '@/api/index.js';
	import {
		utils
	} from '@/utils/utils.js';
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app';
	import {
		ref
	} from 'vue';
	onShow(() => {
		userInfo(); //获取用户信息
		getBankMessage();
	});

	const userProfile = ref({}); //存储用户信息
	const bankMessage = ref({})  //银行卡信息
	const amount = ref(0)
	
	const getBankMessage = async ()=>{
		const ret = await getBank();
		if (ret.code == 1) {
			bankMessage.value = ret.data;
			
			console.log('银行卡信息', bankMessage.value);
		} else {
			utils('数据加载失败！');
		}
	}
	// 获取用户信息
	const userInfo = async () => {
		const ret = await getshopbk();
		if (ret.code == 1) {
			userProfile.value = ret.data;
	
			// console.log('个人信息', userProfile.value);
		} else {
			utils('数据加载失败！');
		}
	};
	const iptAmount = async(e)=>{
		amount.value = Number(e.detail.value)
	}
	const jihuo = async () => {
		if(Number(amount.value)>Number(userProfile.coin)||isNaN(Number(amount.value))){
			uni.showToast({
				icon:'none',
				title:'输入金额不正确，请重新输入'
			})
			return false
		}
		const ret = await withdrawApply({
			type: 'wechat',
			money:amount.value,
			account_name:bankMessage.value.account_name,
			// account_no:bankMessage.value.account_no,
			// account_header:bankMessage.value.account_header,
		});
		if (ret.code == 1) {
			uni.showToast({
				title: ret.msg
			})
			setTimeout(() => {
				uni.navigateBack({
					delta: 1
				})
			}, 1000)
			// console.log('个人信息', userProfile.value);
		} else {
			utils(ret.msg);
		}
	}
</script>

<style lang="scss" scoped>
.wai {
    .btm {
        .btn {
            width: 528rpx;
            height: 80rpx;
            background: #ff9b29;
            border-radius: 50rpx;
            line-height: 80rpx;
            text-align: center;
            color: #fff;
            font-size: 28rpx;
            margin: 108rpx auto 200rpx;
        }
        .flex {
            .input {
                flex: 1;
            }
            .qq {
                color: #333333;
                font-size: 64rpx;
                margin-right: 30rpx;
                font-weight: 400;
            }
            display: flex;
            align-items: center;
            height: 105rpx;
            margin-top: 54rpx;
            padding-bottom: 12rpx;
            border-bottom: 2rpx solid #e6e6e6;
        }
        background-color: #fff;
        padding: 40rpx 20rpx;
        border-radius: 20rpx;
        margin-top: 38rpx;
        color: #333333;
        font-size: 32rpx;
    }
    .bgi {
        .mony {
            color: #ffffff;
            font-size: 72rpx;
            position: absolute;
            left: 38rpx;
            top: 106rpx;
        }
        .yuan {
            position: absolute;
            top: 42rpx;
            left: 38rpx;
            color: #ffffff;
            font-size: 32rpx;
        }
        .img-bgi {
            width: 686rpx;
            height: 264rpx;
        }
        position: relative;
    }
    padding: 22rpx 32rpx;
    min-height: 100vh;
    background-color: #f7f7f7;
}
</style>
